Interpolating property values

Use the Property Target Interpolator when you want to dynamically set the target value for a property and want to interpolate the current value to the target value over time. For example, use the Property Target Interpolator to interpolate the rotation of a gauge needle to a target value regardless of its current position.

Interpolating property values

To interpolate property values:

  1. In the Project select the node which contains the property you want to interpolate.
    For example, in Kanzi Studio open the project stored in the <KanziWorkspace>/Examples/XML data source/Tool_project directory and select the RootPage > Gauges > SpeedNeedle node. You use the Property Target Interpolator to gradually move the SpeedNeedle node from its previous to the current position when the value of the speed changes in the data source. To learn how to create that project, see Tutorial: Create gauges and Tutorial: Get application data from a data source.
  2. In the Node Components > Animation section click + Add Animation and select Property Target Interpolator.
  3. In the Node Components > Animation section in the Property Target Interpolator set:

    When you change the value of the property you set in the Interpolated Property Type, the Property Target Interpolator interpolates the current value to the target value over time. In this example, the Property Target Interpolator interpolates the value of the Speed property to change the position of the Speed needle. To change the interpolation, in the Property Target Interpolator adjust the values of the Acceleration and Drag properties.

Interpolating rotation of 3D nodes

To interpolate rotation of 3D nodes:

  1. In the Library press Alt and right-click Property Types, select Property Type, and create a float property type.
    For example, create a float property type called Interpolator.
  2. In the Project select or create the 3D node the rotation of which you want to interpolate.
    For example, select the speed gauge needle in your project.
  3. In the Node Components > Animation section click + Add Animation and select Property Target Interpolator.
  4. In the Node Components > Animation section in the Property Target Interpolator set:
  5. In the Project select the 3D node the rotation of which you want to interpolate, in the Properties add the Bindings property, and in the Binding Argument Editor set:

    Click Save.

  6. In the Properties click + Add Binding and in the Binding Argument Editor set:

    Click Save.

    When you change the value of the property which you use to control the rotation, the Property Target Interpolator gradually changes the value to the target value over time. To change the interpolation, in the Property Target Interpolator adjust the values of the Acceleration and Drag properties.

Getting information about completed interpolation

When Property Target Interpolator completes the interpolation of the property it interpolates, it sends a message. You can intercept that message to find out when the property it interpolated reached its final value.

To get the information about completed interpolation:

  1. Add and configure Property Target Interpolator for a property you want to interpolate. See Interpolating property values.
  2. In the Project select a node where you want to get the information about the interpolation completed by the Property Target Interpolator.
    For example, if you use the Property Target Interpolator in the SpeedNeedle node, but want to get the information about the completed interpolation in the RootPage node, select the RootPage node.
  3. In the Node Components > Triggers section right-click and select Add Trigger > Animation > Interpolation Completed.
    Interpolation Completed trigger intercepts the message a Property Target Interpolator sends when it finishes interpolating the value of the property it interpolates.
  4. In the Node Components > Triggers section in the Interpolation Completed trigger you added in the previous step click Trigger Settings and set the Message Source property to the node which has the Property Target Interpolator for which you want to find out when it completes the interpolation.
    For example, if you want to find out in the RootPage node when the Property Target Interpolator finishes interpolating a property in the SpeedNeedle, in the Trigger Settings set the Message Source to the SpeedNeedle node.
  5. In the Node Components add to the Interpolation Completed trigger the action you want to use when the Property Target Interpolator sends the message that the it finished interpolating the value of the property.
    For example, add the Start Animation Playback action to start an animation, or add the Set Property action to set the value of a property.

See also

Creating property driven animations

Animations